@import "@/common/constants/StyleConst.scss";

:deep .white-input-24 {
  align-items: center;

  &.v-text-field.v-text-field--solo.v-input--dense {
    .v-input__control {
      min-height: 24px;
      border-radius: 8px;
      border: 1px solid $color-theme-lightgrey;
      box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
      border-radius: 4px;
    }
  }

  .v-input__slot {
    padding: 0 5px !important;
    background-color: $color-text-white !important;
    box-shadow: unset !important;

    .v-text-field__slot {

      input,
      textarea {
        font-size: 12px;
        color: $color-theme-grey;
        margin-top: unset;
      }
    }

    .v-select__slot {
      .v-select__selections {
        .v-select__selection {
          font-size: 12px;
          color: $color-theme-grey;
        }
      }
    }
  }
}


.form-info {
  margin-top: 24px;

  ::v-deep .v-data-table__wrapper {
    overflow-x: unset;
    overflow-y: unset;
    .add-icon::before {
      width: 24px;
      height: 24px;
      line-height: 24px;
      border-radius: 12px;
      background-color: $color-theme-lightblue;
      margin-right: 13px;
      color: $color-theme-lightgrey;
      font-size: 20px;
      font-weight: 700;
      text-align: center;
    }

    .v-data-table-header {
      background-color: $color-theme-lightgrey;
    }

    thead {
      overflow: hidden;

      tr {
        th {
          height: 40px;
          border-bottom: unset !important;
          span {
            font-weight: 400;
            font-size: 12px;
            color: $color-theme-grey;
          }
          .v-input__control {
            .v-input__slot {
              .v-input--selection-controls__input {
                .v-input--selection-controls__ripple {
                border-radius: 50%;
                }
                span {
                  display: none;
                }
              }
            }
          }
          .align-items {
            .v-icon.v-icon::after{
              width: unset;
              height: unset;
            }
          }
        }

        :nth-child(1) {
          border-radius: 8px 0 0 8px;
        }

        :last-child {
          border-radius: 0 8px 8px 0;

        }
      }

    }

    tbody {
      tr {
        td {
          height: 40px;
          border-bottom: unset !important;
          font-size: 12px;
          color: $color-theme-grey;
          .v-input__control {
            .v-input__slot {
              .v-input--selection-controls__input {
                .v-input--selection-controls__ripple {
                border-radius: 50%;

                }
                span {
                  display: none;
                }
              }
            }
          }
        }
        :nth-child(1) {
          border-radius: 8px 0 0 8px;
        }

        :last-child {
          border-radius: 0 8px 8px 0;

        }
        .add-icon {
          visibility: hidden;
        }

        .action {
          visibility: hidden;
        }

        &:hover {
          box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.25);
          border-radius: 8px;

          .action {
            visibility: visible;
            align-items: center
          }
        }
      }
    }
  }
}